// pages/category/index.js
import { request } from "../../request/index.js";
Page({
  data: {
    // 左侧菜单数据
    leftMenuList: [],
    // 右侧商品数据
    rightContent: [],
    // 被点击的左侧菜单
    currentIndex: 0,
    // 右侧内容的滚动条距离顶部的距离
    scrollTap: 0
  },
  // 接口返回数据
  Cates: [],

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 1 先判断一下本地存储中有没有旧数据
    // {time:Date.now(),data:[...]}
    // 2 没有旧数据 直接发送新请求
    // 3 有旧数据 同时 旧数据也们没有过期 就使用本地存储中的旧数据皆可
    const Cates = wx.getStorageSync("cates")
    if (!Cates) {
      this.getCates()
    } else {
      // 有旧数据 定义过期时间
      if (Date.now() - Cates.time > 1000 * 20) {
        this.getCates()
      } else {
        this.Cates = Cates.data
        // 构造左侧的大菜单数据
        let leftMenuList = this.Cates.map(v => v.cat_name)
        // 构造右侧商品数据
        let rightContent = this.Cates[0].children
        this.setData({
          leftMenuList,
          rightContent
        })
      }
    }
  },
  // 获取分类数据
  async getCates() {
    // request({
    //   url: "/categories"
    // })
    // .then(res => {
    //   this.Cates = res.data.message

    //   // 把接口的数据存入到本地存储中
    //   wx.setStorageSync("cates", { time: Date.now(), data: this.Cates })

    //   // 构造左侧的大菜单数据
    //   let leftMenuList = this.Cates.map(v => v.cat_name)
    //   // 构造右侧商品数据
    //   let rightContent = this.Cates[0].children
    //   this.setData({
    //     leftMenuList,
    //     rightContent
    //   })
    // })

    // 优化成async
    const res = await request({url:"/categories"})
    this.Cates = res
    // 把接口的数据存入到本地存储中
    wx.setStorageSync("cates", { time: Date.now(), data: this.Cates })
    // 构造左侧的大菜单数据
    let leftMenuList = this.Cates.map(v => v.cat_name)
    // 构造右侧商品数据
    let rightContent = this.Cates[0].children
    this.setData({
      leftMenuList,
      rightContent
    })
  },
  // 左侧菜单的点击事件
  handleItemTap(e) {
    const { index } = e.currentTarget.dataset
    // 构造右侧商品数据
    let rightContent = this.Cates[index].children
    this.setData({
      currentIndex: index,
      rightContent,
      // 重新设置 右侧内容的scroll-view标签的距离
      scrollTap: 0
    })

  }
})